<template>
  <div>
    <div class="title">
      <el-breadcrumb>
        <el-breadcrumb-item>首页</el-breadcrumb-item>
        <el-breadcrumb-item>品牌管理</el-breadcrumb-item>
        <el-breadcrumb-item>新增品牌</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
    <!-- bottom -->
    <div class="bottom_list">
      <el-form ref="form" label-width="80px">
        <el-form-item label="品牌名称">
          {{ this.forms.brandName }}
        </el-form-item>
        <el-form-item label="排序">
          {{ this.forms.sort }}
        </el-form-item>
        <el-form-item label="图片">
          <img :src="this.forms.image" alt="" class="images" />
        </el-form-item>
        <el-form-item label="特殊资源">
          {{ this.forms.xianshi }}
        </el-form-item>
        <el-form-item label="展示位置">
          {{ this.forms.desc }}
        </el-form-item>
        <el-form-item>
          <el-button @click="falsup">返回列表</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      forms: {
        id: '',
        brandName: '',
        image: '',
        sort: '',
        xianshi: '',
        desc: '',
      },
    }
  },
  created() {
    this.mett()
  },
  methods: {
    mett() {
      this.forms.id = this.$route.query.id
      this.forms.brandName = this.$route.query.brandName
      this.forms.image = this.$route.query.image
      this.forms.sort = this.$route.query.sort
      this.forms.xianshi = this.$route.query.xianshi
      this.forms.desc = this.$route.query.addspp
      if (this.forms.xianshi == '显示') {
        this.forms.xianshi = '是'
      } else if (this.forms.xianshi == '隐藏') {
        this.forms.xianshi = '否'
      }
    },
    //取消
    falsup() {
      this.$router.push({
        name: 'brand',
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.title {
  margin-bottom: 10px;
  margin-bottom: 40px;
}
//bottom
.bottom_list {
  width: 400px;
  height: 400px;
}

.images {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  margin-right: 30px;
  position: relative;
  top: 10px;
}
</style>
